<template>
	<view>
		<u-alert-tips type="warning" v-if="freenum>=0" :title="'本月免费发布'+freenum+'条,已发布'+publishedNum+'条'" borderColor="#fdf6ec"
			:title-style="{'color':'#FE9C01'}">
		</u-alert-tips>
		<view class="form">
			<u-form-item label="标题" label-width="150rpx" label-position="top">
				<u-input v-model="form.name" type="text" placeholder="请输入" />
			</u-form-item>
			<u-form-item label="图片" prop="photo" label-width="150">
				<u-upload width="160" height="160" :action="action" max-count="6" :file-list="imglist"
					@on-success="imgSuccess" @on-remove="imgRemove"></u-upload>
			</u-form-item>

		</view>
		<topmodel ref="topmodel" :listData="topList" @confirem="confiremTop"></topmodel>
		<view style="height: 120rpx;"></view>
		<botbtn btntext="发布" @confirem="submit"></botbtn>
	</view>
</template>

<script>
	import {
		API_URL
	} from '@/env.js'
	import topmodel from '@/components/Topmodel/Topmodel.vue'
	import botbtn from '@/components/Botbtn/Botbtn.vue'
	export default {
		components: {
			topmodel,
			botbtn,
		},
		data() {
			return {
				freenum: -1,
				publishedNum:0,
				form: {
					name: '',
					pics: '',
					content: '',
					person_name: '',
					person_mobile: '',
					topId: 0,
				},
				seltop: {
					id: 0,
					text: '不置顶'
				},
				topList: [{
					id: 0,
					top_day: 0,
					price: 0,
				}],
				action: API_URL + '/tc/uploadToMinio',
				imglist: [],
				isZhiding:false,
			};
		},
		onLoad() {
			this.getTopConfig()
			this.getCateFreeNum()
		},
		methods: {
			getCateFreeNum() {
				this.$u.get('/home/level/getCateFreeNum', {type:2
				}).then(res => {
					this.freenum = res.nongCount;
this.publishedNum = 7;
				})
			},
			getTopConfig() {
				this.$u.get('/home/getLabel', {
                'dictType':'topConfig'
				}).then(res => {
					this.topList = this.topList.concat(res)
					if(res && res.length>0){
                         this.isZhiding = true;
                      }
				})
			},
			openTop() {
				this.$refs.topmodel.show()
			},
			confiremTop(e) {
				this.form.topId = e.id;
				if (e.top_day == 0) {
					e.text = '不置顶';
				} else {
					e.text = e.dictLabel + '天-￥'+ e.dictValue;
				}
				this.seltop = e;
			},
			imgRemove(index, lists, name) {
				let banner = [];
				lists.map((item) => {
					banner.push(item.response.data);
				})
				if (banner.length > 0) {
					this.form.pics = banner.join(',');
				} else {
					this.form.pics = '';
				}
			},
			imgSuccess(data, index, lists, name) {
				let banner = [];
				lists.map((item) => {
					banner.push(item.response.data);
				})
				if (banner.length > 0) {
					this.form.pics = banner.join(',');
				}
			},
			submit() {
				if (this.form.name == '') {
					return this.$u.toast('请输入标题')
				}
				if (this.form.pics == '') {
					return this.$u.toast('请上传图片')
				}
				if (this.form.remark == '') {
					return this.$u.toast('请输入描述')
				}
				if (this.form.contactName == '') {
					return this.$u.toast('请输入联系人')
				}
				if (this.form.contactPhone == '') {
					return this.$u.toast('请输入联系电话')
				}
				if (!this.$u.test.mobile(this.form.contactPhone)) {
					return this.$u.toast('请输入正确的联系电话')
				}
				this.$u.post('/tc/saveNonglin', this.form).then(res => {
					if (res.status == '1') {
						this.$u.route({
							type: 'redirectTo',
							url: '/pagesPush/pay/pay',
							params: {
								order: JSON.stringify(res),
								type: 'farming'
							}
						});
					} else {
						this.$u.route({
							type: 'redirectTo',
							url: '/pagesPush/push_result/push_result',
							params: {
								type: 'push'
							}
						});
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.form {
		padding: 20rpx;
		background-color: white;

		.face {
			flex: 1;
			display: flex;
			flex-direction: row;
			justify-content: flex-end;
		}
	}

	.rowcell {
		display: flex;
		flex-direction: row;
		align-items: center;
		flex: 1;

		.cell {
			display: flex;
			flex-direction: row;
			align-items: center;
			flex-wrap: wrap;
			flex: 1;

			.item {
				font-size: 25rpx;
				background-color: #F8F8F8;
				padding: 0rpx 15rpx;
				border-radius: 5rpx;
				margin: 5rpx;
				height: 50rpx;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: center;
			}
		}
	}
</style>
